<template>
  <div>
    <!-- 组件:conponent -->
    <!-- 组成页面的零件 -->
    <!-- 系统组件：div span h1 hr img ... -->
    <!-- 自定义组件：利用系统组件组合出自己的组件，可以复用 -->
    <!-- conponent：词目录专门用于存放自定义组件 -->

    <!-- 作者满足所有人的习惯，提供多种语法 -->
    <my-nav></my-nav>
    <mynav/>

    <!-- 小众：使用较少 -->
    <MyNav></MyNav>
    <MyNav/>

    <!-- 别名 -->
    <mynav></mynav>
    <mynav/>
  </div>
</template>

<script>
// 使用自定义组件：先引入 在使用
// 注意:路由带 波浪线
// 1.路径错误 - 检查目录中的名字
// 2.vscode卡了 - 重启
import MyNav from './components/MyNav.vue'  //引入
  export default {
    // 外来的组件：注册到 组件选项中
    // 别名写法：{别名：组件名}
    components:{MyNav,mynav:MyNav}
    // 默认大驼峰 会自动兼容 破折号语法 my-nav 和 MyNav
  }
</script>

<style lang="scss" scoped>

</style>